<template>
    <view class='page'>
        <!-- <u-navbar class="gradient-bg" title="资金明细" navbarType="0" fontColor="#ffffff" gradient="linear-gradient(to bottom right, #2e996f, #3f99ab)"></u-navbar> -->

        <z-paging ref="paging" v-model="dataList" @query="getList">
            <!-- 订单列表 -->
            <view class="order-list">
                <!-- @click="onOrderList(item.order_no)" -->
                <view class="list" v-for="(item, index) in dataList" :key="index" @click="toDetail(item)">
                    <view class="boxl">
                        <text class="p">{{selectDictLabel(statusList,item.withdr_state)}}</text>
                        <text v-if="item.withdr_state==-1" class="time">{{ item.fail_time }}</text>
                        <text v-else-if="item.withdr_state==0" class="time">{{ item.submit_time }}</text>
                        <text v-else-if="item.withdr_state==1" class="time">{{ item.success_time }}</text>
                    </view>
                    <view class="boxr">
                        <text class="money" :class="{'red' : item.withdr_state==1}">-{{item.with_amount}}</text>
                        <text class="time">余额 {{item.staff_remain_amount}}</text>
                    </view>
                </view>
            </view>
        </z-paging>
    </view>
</template>
<script>
import { getWithLists } from "@/api/withdrawal.js"
import { withdrawalStatus } from "@/api/dictionary.js"
export default {
    components: {},
    data() {
        return {
            dataList: [
            ],
            queryParams: {
                page: 1,
                limit: 20,
                key_withdr_state: ''
            },
            statusList: withdrawalStatus
        };
    },
    onLoad(options) {

    },
    onShow() {
        this.getList(1)
    },
    methods: {
        getList(page) {
            this.queryParams.page = page
            getWithLists(this.queryParams).then(res => {
                console.log(res.data, 7)
                let data = res.data.lists
                this.$refs.paging.complete(data);
            }).catch(err => {
                this.$refs.paging.complete(false);
            })
        },
        toDetail(row) {
            console.log(row, "rowww")
            uni.navigateTo({
                url: "/pagesB/withdrawal/fundDetail?id=" + row.id
            })
        }
    },
};
</script>
<style scoped lang='scss'>
.order-list {
  width: 96%;
  background-color: #ffffff;
  border-radius: 10rpx;
  margin: 10rpx auto 0;
  padding: 20rpx 0;
  .list {
    margin: 0 30rpx 0 30rpx;
    border-bottom: solid 1px #eaeaea;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30rpx 0;
    text {
      display: block;
    }
    .time {
      font-size: 24rpx;
      color: #bebebe;
      padding-top: 8rpx;
      text-align: right;
    }
    .boxl {
      .p {
        font-size: 28rpx;
        color: #333333;
        // padding-bottom: 10rpx;
        line-height: 48rpx;
      }
    }
    .boxr {
      .money {
        font-size: 48rpx;
        line-height: 48rpx;
      }
      .red {
        color: #f62c2c;
      }
    }
  }
}
</style>